<template>
    <div class='InfoList'>
       <ul >
           <li v-for = 'info in infoList'>
               <router-link to='/newsid'>
                   <div class='news-summary'>
                       <span style="margin-top:-2px"><i class='icon-circle' style='font-size:8px;color:#333;margin-top:-2px;'></i></span>
                       <span>2016年第三季度计划针对公司基层人员,管理人员,领导层展开为期3个月的集训计划1</span>
                   </div>
                  <div class='date'>
                      <span>2016-01-01</span> 
                  </div> 
               </router-link>
           </li>
       </ul>
    </div>
</template>
<script>
    export default{
        data(){
            return {
                infoList:[0,1]
            }
        },
        mounted(){
            // 从服务端取数据,赋值给infoList.
            this.infoList = [1,2,3,4,5,6,7,8,9,0,1,3,3,4,5,6,3,2];
        }
    }
</script>
<style lang='scss'>
    .InfoList{
        width:100%;
        background:white;
        ul{
            li{
                list-style:none;
                display:block;
                position:relative;
                padding:10px 15px 0 15px;
                a{
                    display:block;
                    width:100%;
                    height:80px;
                    border-bottom:1px solid #ddd;
                   
                .news-summary{
                    width:100%;
                    margin-bottom:5px;
                    span{
                          color:#555;
                          font-size:14px;
                    }
                }
                .date{
                    color:#ccc;
                    display:block;
                    width:100%;
                    height:20px;
                    line-height:20px;
                    font-size:12px;
                    text-align:right;
                    } 
                }
            }
        }
    }
</style>